<script setup lang="ts">
import { User, Van, TrendCharts } from '@element-plus/icons-vue'
</script>
<template>
  <div class="common-layout">
    <el-container>
      <el-aside width="200px">
        <el-menu
          :router="true"
          default-active="/manage/daily/customerManage"
          class="el-menu-vertical-demo"
        >
          <el-menu-item index="/manage/daily/customerManage">
            <el-icon><user /></el-icon>
            <span>客户管控</span>
          </el-menu-item>
          <el-menu-item index="/manage/daily/milkmanManage">
            <el-icon><van /></el-icon>
            <span>配送管理</span>
          </el-menu-item>
          <el-menu-item index="/manage/daily/dailyPlan">
           <el-icon><trend-charts /></el-icon>
            <span>每日计划</span>
          </el-menu-item>
        </el-menu>
      </el-aside>
      <el-container>
        <el-main class="main-container">
          <router-view />
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<style lang="scss" scoped>
  .common-layout {
    width: calc(100% - 10px);
    margin-left: 10px;
    .el-menu-vertical-demo {
      border-radius: 4px;
      border:  1px solid #e4e7ed;
    }
  .main-container {
    width: calc(100% - 210px);
    padding: 0 10px;
  }
}
</style>
